<template>
<div style="padding:20px;">
<el-card class="box-card">
  <el-page-header slot="header" @back="goBack" content="用户注册" />
  <div class="card-body">
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="用户名">
        <el-input v-model="form.username"></el-input>
      </el-form-item>
      <el-form-item label="密码">
        <el-input v-model="form.password"></el-input>
      </el-form-item>
      <el-form-item label="重复密码">
        <el-input
            v-model="form.confirmPassword"
            show-password
            autocomplete="off"
          />
      </el-form-item>
      <el-form-item label="姓名">
        <el-input v-model="form.name"></el-input>
      </el-form-item>
      <el-form-item label="组织机构">
        <el-cascader style="width:100%;" v-model="form.department" placeholder="请选择组织机构" :options="options.tree" :props="{ expandTrigger: 'hover' }" />
      </el-form-item>
      <el-form-item label="身份证号">
        <el-input v-model="form.idcard"></el-input>
      </el-form-item>
      <el-form-item label="出生日期">
        <el-col :span="11">
          <el-date-picker
            type="date"
            placeholder="出生日期"
            v-model="form.birthday"
            style="width: 100%;"
          ></el-date-picker>
        </el-col>
      </el-form-item>
      <el-form-item label="性别">
        <el-radio-group v-model="form.sex">
          <el-radio label="1">男</el-radio>
          <el-radio label="2">女</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="民族">
        <el-select v-model="form.ethnic" placeholder="请选择民族">
          <el-option label="汉族" value="01"></el-option>
          <el-option label="蒙古族" value="02"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="警号">
        <el-input v-model="form.workid"></el-input>
      </el-form-item>
      <el-form-item label="手机号">
        <el-input v-model="form.idcard"></el-input>
      </el-form-item>
      <el-form-item label="集团小号">
        <el-input v-model="form.idcard"></el-input>
      </el-form-item>
      
      <el-form-item style="text-align: center;" label-width="0">
        <el-button type="primary" @click="onSubmit">立即注册</el-button>
      </el-form-item>
    </el-form>
  </div>
</el-card>
</div>
</template>

<script>
import dictCache from '../../global/dictCache.js'
import { form } from "@opts/admin/user-manager.js";
  export default {
    data() {
      return {
        form: {...form,confirmPassword:''},
        options:[]
      }
    },
    methods: {
      onSubmit() {
        this.goBack()
      },
      goBack(){
        window.location.href = "/login.html"
      }
    },
    async created(){
      this.options = await dictCache.getTree('行政区划')
    }
  }
</script>

<style lang="less" scoped>
.box-card{
  width:600px;
  text-align: center;
  margin:auto;
}
.clearfix {
  text-align: left;
}
.card-body{
  text-align: left;
}
</style>